$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'onlinestudy/xcbm/xxVideoList',
        datatype: "json",
        postData:{"title":undefined},
        colModel: [			
			{ label: 'id', name: 'id', index: 'id', width: 50, key: true,hidden:true },
			{ label: '标题', name: 'title', index: 'title', width: 160 },
			{ label: '描述', name: 'decribe', index: 'decribe', width: 100 },
			{ label: '缩略图', name: 'img', index: 'img', width: 80,hidden:true },
			{ label: '视频', name: 'video', index: 'video', width: 80,hidden:true },
			{ label: '录入时间', name: 'ldate', index: 'ldate', width: 80,formatter:formatSubscribeTime},
			{ label: '播放时长', name: 'bfsc', index: 'bfsc', width: 80 }			
        ],
		viewrecords: true,
        height: 385,
        rowNum: 10,
		rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
});

function uploadProgress(evt) {
    if (evt.lengthComputable) {
        var percentComplete = Math.round(evt.loaded * 100 / evt.total);
        // document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
        $(".progress-bar").removeClass("progress-bar-success").css("width", percentComplete.toString() + '%').text(percentComplete.toString() + '%');
    }
    else {
        // document.getElementById('progressNumber').innerHTML = '无法计算';
        $(".progress-bar").removeClass("progress-bar-success").text("无法计算");
    }
}

function uploadComplete(evt) {
    /* 当服务器响应后，这个事件就会被触发 */
    var response = JSON.parse(evt.target.responseText);
    if(response.code == 0){
        alert("视频上传成功！");
        vm.reload();
        $(".progress-bar").css("width","0%").text("准备开始....");
    }else{
        alert("学习视频上传失败，错误信息如下：" + response.msg);
        $(".progress-bar").css("width","0%").text("准备开始....");
    }

}

function uploadFailed(evt) {
    alert("上传文件发生了错误尝试");
}

function uploadCanceled(evt) {
    alert("上传被用户取消或者浏览器断开连接");
}

var vm = new Vue({
	el:'#rrapp',
	data:{
		showList: true,
		title: "",
		xcVideo: {},
        tab_name:null
	},
	methods: {
		query: function () {
			vm.reload();
		},
		add: function(){
			vm.showList = false;
			vm.tab_name = "上传";
			vm.xcVideo = {};
		},
		save: function (event) {
            var url = "onlinestudy/xcbm/videoupload";
            var formdata = new FormData(document.getElementById("uploadForm"));
            var xhr = new XMLHttpRequest();
            xhr.upload.addEventListener("progress", uploadProgress, false);
            xhr.addEventListener("load", uploadComplete, false);
            xhr.addEventListener("error", uploadFailed, false);
            xhr.addEventListener("abort", uploadCanceled, false);
            xhr.open("POST", baseURL+url);
            xhr.send(formdata);
            // var req = new XMLHttpRequest();
            // req.open("post", baseURL+url, false);
            // req.send(formdata);
            // $.ajax({
				// type: "POST",
			 //    url: baseURL + url,
			 //    data: formdata,
            //     processData:false,
            //     contentType:false,
			 //    success: function(r){
			 //    	if(r.code === 0){
				// 		alert('操作成功', function(index){
				// 			vm.reload();
				// 		});
				// 	}else{
				// 		alert(r.msg);
				// 	}
				// }
            // });
		},
		del: function (event) {
			var ids = getSelectedRows();
			if(ids == null){
				return ;
			}
			
			confirm('确定要删除选中的记录？', function(){
				$.ajax({
					type: "POST",
				    url: baseURL + "onlinestudy/xcbm/deleteVideos",
                    contentType: "application/json",
				    data: JSON.stringify(ids),
				    success: function(r){
						if(r.code == 0){
							alert('操作成功', function(index){
								$("#jqGrid").trigger("reloadGrid");
							});
						}else{
							alert(r.msg);
						}
					}
				});
			});
		},
		getInfo: function(id){
			$.get(baseURL + "onlinestudy/xcvideo/info/"+id, function(r){
                vm.xcVideo = r.xcVideo;
            });
		},
		reload: function (event) {
			vm.showList = true;
            var postdata = $("#jqGrid").jqGrid('getGridParam','postData');
            $.each(postdata, function (k,v) {
                delete postdata[k];
            });
			var parms = {title:vm.title == ""?undefined:vm.title};
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam',{ 
                page:page,
                postData:parms
            }).trigger("reloadGrid");
		}
	}
});